﻿@model S4Store.Models.Chart.Column
@{
    Layout = null;
    ViewBag.Title = "Column";
    var container = "div" + Guid.NewGuid().ToString();
    var xAxis = new List<String>();
    foreach(var xs in Model.XAxis){
        xAxis.Add("'" + xs + "'");
    }
    var rate = "";
    if (Model.IsRate){ rate = "%";}
    if (Model.IsRate && !Model.YAxis.Contains("%"))
    {
        Model.YAxis += "(%)";
    } 
    var cls = new List<String>();
    foreach (var xs in Model.Colors)
    {
        cls.Add("'" + xs + "'");
    }
}
<div id="@container"></div>       
<script type="text/javascript">
    $('#@container').highcharts({
        chart: {
            type: 'column'
            @if(Model.Width!=null){
                <text>
                ,
                width:@Model.Width
                </text>
            }
            
            @if(Model.Height!=null){
                <text>
                ,
                height:@Model.Height
                </text>
            }
        },
        colors: [@Html.Raw(String.Join(",", cls))] ,
        title: {
            text: '@Model.Name'
        },
        xAxis: {
            categories: [@Html.Raw(String.Join(",", xAxis))]
        },
        yAxis: {
            @(Model.IsNegative?"":"min: 0,")
            title: {
                text: '@Model.YAxis'
            }
        },
        tooltip: {
            headerFormat: '<b>{point.key}</b><br /><table>',
            pointFormat: '<tr><td style="color:{series.color};padding:0">{series.name}: </td>' +
            '<td style="padding:0"><b>{point.y}@rate</b></td></tr>',
            footerFormat: '</table>',
            shared: true,
            useHTML: true
        },
        plotOptions: {
            column: {
                pointPadding: 0.2,
                borderWidth: 0
            }
        },
        series: [
        @for(int i=0;i<Model.Serieses.Count;i++){
                    var series=Model.Serieses[i];
                    <text>
                    {
                        name: '@series.Name',
                        data: [@String.Join(",", series.FormatData)]
                    }
                    </text>
                    if(i<Model.Serieses.Count-1){
                        <text>,</text>
                    }
         }        
        ]
    });
</script>

